<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>首页</title>
  </head>
  <body>
    <div class="box">
      <header>
        <div>
          <span>天空之城™</span>
          <ul>
            <li><a href="./index.html"> 首页 </a></li>
            <li><a href="./html/explore/index.html"> 探索 </a></li>
            <li><a href="./html/tag/index.html"> 标签 </a></li>
            <li><a href="./html/operator/index.html"> 摄影师 </a></li>
            <li><a href="#"> 签约摄影师招募 </a></li>
            <li><a href="#"> 热门活动 </a></li>
            <li>
              <a href="#">
                天空之城8周年摄影大赛
                <div>HOT</div>
              </a>
            </li>
          </ul>
          <div class="header-right">
            <div class="search"></div>
            <a href="#">登录</a>
            <a href="#">注册</a>
          </div>
        </div>
      </header>
      <div class="banner">
        <img src="./images/banner.png" alt="" />
        <div class="dot">
          <div></div>
          <div></div>
          <div></div>
          <div></div>
        </div>
      </div>
      <div class="main-top">
        <div>
          <h2>热门航拍点</h2>
          <div>
            <div class="main-item">
              <img src="./images/hot1.png" alt="" /><span>澳大利亚</span>
            </div>
            <div class="main-item">
              <img src="./images/hot2.png" alt="" /><span>美国</span>
            </div>
            <div class="main-item">
              <img src="./images/hot3.png" alt="" /><span>冰岛</span>
            </div>
            <div class="main-item">
              <img src="./images/hot4.png" alt="" /><span>西藏</span>
            </div>
            <div class="main-item">
              <img src="./images/hot5.png" alt="" /><span>上海</span>
            </div>
            <div class="main-item">
              <img src="./images/hot6.png" alt="" /><span>新疆</span>
            </div>
          </div>
        </div>
      </div>
      <main>
        <div class="main-middle">
          <div class="main-content">
            <div class="main-content-top">
              <span>自然</span>
              <div>
                <div class="dot">
                  <div></div>
                  <div></div>
                  <div></div>
                  <div></div>
                </div>
                <a href="#">更多 &gt;</a>
              </div>
            </div>
            <div class="main-item">
              <div class="main-content-item">
                <img src="./images/3-1.png" alt="" />
                <div class="main-content-info">
                  <h4>向阳起航</h4>
                  <p>设备:<span>Mavic 2 Pro</span></p>
                  <div>
                    <div class="eyes">
                      <div></div>
                      <span>772</span>
                    </div>
                    <div class="agree">
                      <div></div>
                      <span>26</span>
                    </div>
                  </div>
                </div>
                <div class="line"></div>
                <div class="user">
                  <div>
                    <div></div>
                    <span>Szjjj</span>
                  </div>
                  <time>2022年12月02日</time>
                </div>
              </div>
              <div class="main-content-item">
                <img src="./images/3-2.png" alt="" />
                <div class="main-content-info">
                  <h4>Glacier</h4>
                  <p>设备:<span>Mavic 2 Pro</span></p>
                  <div>
                    <div class="eyes">
                      <div></div>
                      <span>2165</span>
                    </div>
                    <div class="agree">
                      <div></div>
                      <span>48</span>
                    </div>
                  </div>
                </div>
                <div class="line"></div>
                <div class="user">
                  <div>
                    <div></div>
                    <span>Ananda_wildfilmmaker</span>
                  </div>
                  <time>2022年11月30日</time>
                </div>
              </div>
              <div class="main-content-item">
                <img src="./images/3-3.png" alt="" />
                <div class="main-content-info">
                  <h4>万物沉寂</h4>
                  <p>设备:<span>DJI Mavic 3</span></p>
                  <div>
                    <div class="eyes">
                      <div></div>
                      <span>1442</span>
                    </div>
                    <div class="agree">
                      <div></div>
                      <span>43</span>
                    </div>
                  </div>
                </div>
                <div class="line"></div>
                <div class="user">
                  <div>
                    <div></div>
                    <span>DJI 阿Kun</span>
                  </div>
                  <time>2022年12月01日</time>
                </div>
              </div>
              <div class="main-content-item">
                <img src="./images/3-4.png" alt="" />
                <div class="main-content-info">
                  <h4>Ice Bergs on Land</h4>
                  <p>设备:<span>DJI Mavic 3</span></p>
                  <div>
                    <div class="eyes">
                      <div></div>
                      <span>1442</span>
                    </div>
                    <div class="agree">
                      <div></div>
                      <span>48</span>
                    </div>
                  </div>
                </div>
                <div class="line"></div>
                <div class="user">
                  <div>
                    <div></div>
                    <span>Mike Tesselaar</span>
                  </div>
                  <time>2022年12月01日</time>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="main-bottom">
          <div>
            <h2>热门标签</h2>
            <div>
              <div class="main-item">
                <img src="./images/end1.png" alt="" /><span>天生会飞</span>
              </div>
              <div class="main-item">
                <img src="./images/end2.png" alt="" /><span
                  >DJI MAVIC 巅峰之旅</span
                >
              </div>
              <div class="main-item">
                <img src="./images/end3.png" alt="" /><span
                  >普通视角 VS 航拍视角</span
                >
              </div>
              <div class="main-item">
                <img src="./images/end4.png" alt="" /><span>晚霞</span>
              </div>
              <div class="main-item">
                <img src="./images/end5.png" alt="" /><span
                  >DJI Mini 3 Pro</span
                >
              </div>
              <div class="main-item">
                <img src="./images/end6.png" alt="" /><span>DJI Mavic 3</span>
              </div>
            </div>
          </div>
        </div>
      </main>
      <footer>
        <div class="f-top">
          <div class="l">
            <p>
              Copyright © 2022 <a href="#">Skypixel.com</a> 天空之城 版权所有
            </p>
          </div>
          <div class="m">
            <a href="#">使用条款</a><a href="#">隐私政策</a
            ><a href="#">内容指引</a><a href="#">网站反馈</a
            ><a href="#">常见问题</a>
          </div>
          <div class="r">
            <a href="#">中文</a><span>|</span><a href="#">English</a>
          </div>
        </div>
        <div class="f-bottom">
          <a href="#">粤ICP备2022092332号</a>
          <div></div>
        </div>
      </footer>
    </div>
  </body>
</html>
